<template>
	<com-popup
		ref="popup"
		:action="true"
		:confirmText="props.confirmText"
		title="选择支付方式"
		:closeOnClickMask="true"
		:showClose="false"
		@close="emits('close')"
		@submit="submitFn">
	    <view class="gy-pay-select">
	    	<!-- <view class="gy-pay-select-item" @click.stop="payType = '1'">
	    		<view class="gy-pay-select-item-label">
	    			账户余额支付<text>（当前余额：<text>¥</text>{{ balance }}）</text>
	    		</view>
	    		<com-radio v-model="payType" activeValue="1" activeText="" />
	    	</view> -->
	    	<com-divider text="" />
	    	<view class="gy-pay-select-item" @click.stop="payType = '2'">
	    		微信支付
	    		<com-radio v-model="payType" activeValue="2" activeText="" />
	    	</view>
	    </view>
	</com-popup>
</template>

<script lang="ts" setup>

	import {
		ref,
		onMounted,
		getCurrentInstance
	} from "vue";

	import {
		getAccountBalance,
	} from "@/request/apis/inspect.js";

	const { proxy } : any = getCurrentInstance();

	const popup: any = ref(null);

	const emits = defineEmits(["submit", "close"]);

	const props = defineProps({
	    patientId: {
	    	type: String
	    },
		totalAmount: {
			type: Number,
			default: 0
		},
		confirmText: {
			type: String,
			default: "立即支付"
		}
	});

	const payType = ref("");
	const balance = ref(0);

	function submitFn(){
		if(balance.value < props.totalAmount && payType.value === '1'){
			uni.showToast({
				title:"当前余额不足",
				icon:'error',
				duration: 2000
			})
			return
		}else{
			emits("submit", payType.value);
			popup.value?.closeFn();
		}

	}

	onMounted(() => {
		// getAccountBalance({
		// 	patientId: props.patientId
		// }).then((res : any) => {
		// 	balance.value = Number(res);
		// 	payType.value = balance.value < props.totalAmount ? "2" : "1";
		// }).catch(() => {
		// 	balance.value = 0;
		// 	payType.value = "2";
		// });
	});

	defineExpose({
		closeFn: () => {
			popup.value?.closeFn();
		}
	});

</script>

<script lang="ts">
	export default {
		options: {
			multipleSlots: true,
			styleIsolation: 'shared',
			addGlobalClass: true,
			virtualHost: true
		}
	}
</script>

<style lang="scss" scoped>
	.gy-pay-select {
		padding: var(--gy-gap) var(--gy-gap) var(--gy-gap);
		.gy-pay-select-item {
			@include flex-between-center;
			font-size: var(--gy-font-size-medium);
			.gy-pay-select-item-label {
				font-weight: blod;
				text{
					font-weight: 400;
					color: var(--gy-text-color-secondary);
					font-size: var(--gy-font-size-base);
				}
			}
			:deep(.gy-radio) {
				padding: 0;
			}
		}
		:deep(.gy-divider) {
			margin: var(--gy-gap) 0;
		}
	}
</style>
